<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>xjl-phone</title>
		<link rel="stylesheet" href="css/index.css">
	</head>
	<body>
		<div class="web">
			<div class="click-bg" id="bg">

			</div>
			<div class="pop" id="pop">
				<div id="tDiv" class="tab-div">
					<ul id="tab-list" class="tab">
						<li class="tab-active"><p>登陸</p></li>
						<li><p>注冊</p></li>
						<p class="close" id="close">×</p>
					</ul>
					<div class="tab-content tab-content-show">
						<ul class="text">
							<li>用戶賬號:</li>
							<li>用戶密碼:</li>
							<li>驗證碼:</li>
						</ul>
						<form action="">
							<ul>
								<li><input type="text" name="username" value=""></li>
								<li><input type="password" name="password" value=""></li>
								<li class="test"><input type="text" name="cost" value=""></li>
							</ul>
							<input type="hidden" name="" value="">
							<input type="button" class="denglu" id="btnlogin" name="" value="立即登入">
						</form>
						<span class="other">
							其他賬號登入:
						</span>
					</div>
					<div class="tab-content tab-content-hide">
						<ul class="text2">
							<li>賬號:</li>
							<li>密碼:</li>
							<li>確認密碼:</li>
							<li>電子信箱:</li>
						</ul>
						<form action="" class="teshu">
							<ul>
								<li class="registered-username">
									<input type="text" id="name" name="registeredusername">
									<p>長度3~32個字符,包括字母、數字、下底線、@</p>
								</li>
								<li class="registered-username">
									<input type="password" id="key" name="registeredpassword">
									<p>6~20個字符,包括字母、數字</p>
								</li>
								<li class="registered-username">
									<input type="password" id="key2" name="querenpassword">
									<p>再次輸入密碼</p>
								</li>
								<li class="registered-username">
									<input type="email" id="email" name="email">
									<p>密碼遺忘或被盜時,可以通過此信箱取回密碼,請認真填寫</p>
								</li>
							</ul>
							<p class="accent">
								<input type="checkbox" name="accent">
								<span>我接受LunPlay遊戲平台線上遊戲服務合約書</span>
							</p>
							<p class="subscription">
								<input type="checkbox" name="subscription">
								訂閱倫奇在線報，掌握最新資訊。
							</p>
							<input type="button" class="registered" id="btn" name="" value="立即注冊">
						</form>
					</div>
				</div>
			</div>
			<div class="all">
				<div class="bg">
					<img src="img/bg.png">
				</div>
				<div class="apple">
					<a href="#"></a>
				</div>
				<div class="google">
					<a href=""></a>
				</div>
				<div class="apk">
					<a href=""></a>
				</div>
				<div class="fb">
					<a href=""></a>
				</div>
				<div class="activity-time">
					<p>活動時間：X月X日-X月X日</p>
				</div>
				<div class="activity1">
					<p>已完成任務<span>100人</span></p>
				</div>
				<div class="activity2">
					<p>已完成任務<span>100人</span></p>
				</div>
				<div class="activity3">
					<p>已完成任務<span>100人</span></p>
				</div>
				<div class="activity4">
					<p>已完成任務<span>100人</span></p>
				</div>
				<div class="clickloginin" id="login_in">
					<p>我要登入</p>
				</div>
				<form action="" id="form">
					<div class="select">
						<select name="server" id="server">
							<option value="volvo" selected>選擇伺服器</option>
							<option value="saab">1</option>
							<option value="opel">2</option>
							<option value="audi">3</option>
						</select>
					</div>
					<div class="select2">
						<select name="server" id="role">
							<option value="volvo" selected>選擇角色</option>
							<option value="saab">1</option>
							<option value="opel">2</option>
							<option value="audi">3</option>
						</select>
					</div>
				</form>
			</div>
		</div>
		
		<script>
            document.body.style.height = window.innerHeight + "px";
            function recalc() {
                var clientWidth = document.documentElement.clientWidth;
                if(!clientWidth) return;
                document.documentElement.style.fontSize = 40 * (clientWidth / 750) + 'px';
            }
            function initRecalc() {
                recalc();
                var resizeEvt = 'osrientationchange' in window ? 'orientationchange' : 'resize';
                if(!document.addEventListener) return;
                window.addEventListener(resizeEvt, recalc, false);
                document.addEventListener('DOMContentLoaded', recalc, false);
            }
            initRecalc();
		</script>
		<script src="js/index.js"></script>
	</body>
</html>
